<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Lbb</title>
  <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
  <link href="vendor/bootoast/bootoast.css" rel="stylesheet">
  <style>
    html,
    body {
      height: 100%;
      width: 100%;
    }

    body {
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    footer {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      text-align: center;
    }

    div.form {
      width: 320px;
      align-self: center;
      border: 1px solid #e1e1e1;
      padding: 16px 16px 0 16px;
      border-radius: 8px;
      box-shadow: 1px 6px 10px rgba(0, 0, 0, 0.6);
    }

    div.float-layer {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      width: 128px;
      height: 24px;
      background-color: rgba(0, 0, 0, 0.6);
      margin: 0 auto;
    }
  </style>
</head>

<body>
  <header>
  </header>

  <div class="form form-horizontal">
    <div class="form-group">
      <label class="col-sm-3 control-label" for="username">Username</label>
      <div class="col-sm-9">
        <input id="username" class="form-control" type="text" placeholder="Username">
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 control-label" for="password">Password</label>
      <div class="col-sm-9">
        <input id="password" class="form-control" type="password" placeholder="Password">
      </div>
    </div>
    <div class="form-group">
      <div class="checkbox col-sm-offset-3 col-sm-9">
        <label>
          <input type="checkbox">Check me out</label>
      </div>
    </div>
    <div class="form-group">
      <div class="col-sm-offset-3 col-sm-9">
        <input id="submit" type="button" class="btn btn-default" value="Sign in">
      </div>
    </div>
  </div>

  <footer>
    BBbbb
  </footer>

  <script src="vendor/jquery/jquery.min.js"></script>
  <script src="vendor/bootoast/bootoast.js"></script>
  <script src="js/comm.js"></script>
  <script>
    var netModel = new NetModel();
    var submitBtn = $('#submit');

    submitBtn.click(function () {
      var username = $('#username').val();
      if (username.length < 4) {
        $('#username').focus();
        Hub.warn('user name bbbbbbb');
        return;
      }

      var password = $('#password').val();
      if (password.length < 4) {
        $('#password').focus();
        Hub.warn('pass word bbbbbbb');
        return;
      }

      submitBtn.attr("disabled", "disabled");
      netModel.http({
        url: 'user/login',
        data: {
          'username': username,
          'password': password
        },
        success: function (response) {
          if (response.code == 1) {
            window.location.href = "index.html";
          } else {
            Hub.danger(response.msg);
          } 
          submitBtn.removeAttr("disabled");
        }
      })
    });

    $('#username').keyup(function (event) {
      if (event.keyCode === 13) {
        submitBtn.trigger('click');
      }
    });

    $('#password').keyup(function (event) {
      if (event.keyCode === 13) {
        submitBtn.trigger('click');
      }
    });
  </script>
</body>

</html>